/**
* 描述：我的申请
*/
<style lang="scss" scoped>
  @import '../index';
  .table-main{

  }
</style>
<template>
  <div style="width:100%; height:100%;">
    <div class="com-main-title">
      <span class="tit">我的申请</span>
      <a class="nav" :class="{navCur: status == -1}" style="margin-left:30px;" @click="changeStatus(-1)">全部</a>
      <a class="nav" :class="{navCur: status == 1}" @click="changeStatus(1)">投递成功</a>
      <a class="nav" :class="{navCur: status == 2}" @click="changeStatus(2)">被查看</a>
      <a class="nav" :class="{navCur: status == 5}" @click="changeStatus(5)">收到邀请</a>
      <a class="nav" :class="{navCur: status == 5}" @click="changeStatus(5)">已入职</a>
      <a class="nav" :class="{navCur: status == 7}" @click="changeStatus(7)">不合适</a>
      <div class="clear"></div>
      <div class="clear"></div>
    </div>
    <div class="noData" v-show="list && list.length == 0">暂无数据 :-)</div>
    <div class="table-list"  v-for="item in list">
      <div class="left" style="width:300px;">
        <!--<p class="money">{{item.salaryLow}}-{{item.salaryHigh}}</p>-->
        <p class="money">{{item.salary | salaryState}}</p>
        <div class="clear"></div>
        <div class="companyName">{{item.companyName}}</div>
        <div class="clear"></div>
        <div class="info">
          <i>{{item.cityId | cityAndType}}</i><i>|</i><i>{{item.education | education}}</i><i>|</i><i>{{item.experience | userExperience}}</i>
        </div>
      </div>
      <div class="center" style="width:350px;float: left;">
        <h5 style="line-height:30px;font-size:18px;color:#333;margin-top:20px;" class="overflowHidden">{{item.title}}</h5>
        <h5 style="line-height:30px;font-size:12px;margin-top:10px;color:#999;">申请时间：{{item.createdAt}}</h5>
      </div>
      <div class="right">
        <div class="status">投递状态：<i>{{ item.status | invitationState }}</i></div>
        <div class="clear"></div>
        <div class="btns" @click="goToJobDetail(item.jobId)">查看职位详情</div>
        <div class="clear"></div>
      </div>
      <div class="clear"></div>
    </div>
    <div style="float: right;margin-top: 10px;">
      <template>
        <Page :total="totalElement" show-elevator :current="searchData.pageNo" :page-size="searchData.pageSize" @on-change="_getList"></Page>
      </template>
    </div>
  </div>
</template>
<script>
  import list from '@/js/mixins/list';
  import hyHandler from '@/components/handler/handler';
  import { queryList, queryCount, acceptFun } from '@/service/web/user/myApplyService';
  export default {
    mixins: [list],
    components: {
      hyHandler
    },
    data () {
      return {
        status: -1,
        loading: false,
        searchData: {
        },
        statusList: [{value: 1, label: '收到的邀约'}, {value: 2, label: '已接受邀约'}, {value: 3, label: '已入职'}]
      };
    },
    mounted () {},
    methods: {
      // 跳转到职务详情
      goToJobDetail (id) {
        this.$router.push({path: '/jobDetail', query: {id: id}});
      },
      async changeStatus (type) {
        if (type > 0) {
          this.status = type;
          this.searchData.status = type;
        } else {
          if (this.searchData.status) {
            delete this.searchData.status;
          }
          this.status = type;
        }
        await this._getList(this.searchData.pageNo);
      },
      async _getList (val) {
        if (val) this.searchData.pageNo = val;
        this.loading = true;
        let result = await queryList(this.searchData);
        let temp = await queryCount(this.searchData);
        if (!result.data.length) result.data = null;
        this.list = result.data || [];
        this.totalElement = temp.data || 0;
        this.loading = false;
      },
      // 接收邀约
      receiveInvitation (id) {
        this.$confirm('是否接受邀约？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {
          console.log(id);
          await acceptFun({id: id});
          this.$Notice.success({title: '接受成功'});
          this.currentChange();
        }).catch(() => {
        });
      }
    }
  };
</script>
